<template>
    <div>
        <h2>当前计数:{{ counter }}</h2>
        <CounterOperation @addOne="add" @subOne="sub" @addTen="addTen"></CounterOperation>
    </div>
</template>

<script>

import CounterOperation from './CounterOperation.vue'
export default {
    components: { CounterOperation },
    data() {
        return {
            counter: 0
        }
    },
    methods:{
        add(){
            this.counter++
        },
        sub(){
            this.counter--
        },
        addTen(){
            this.counter += 10
        }
    }
}
</script>

<style lang="scss" scoped>
</style>